viewがemitするアクションをuser hooksで扱う

dispatchに対して何らかの、アクションを意味するオブジェクトを渡す

code:js

dispatch({ type:'ADD_TODO', name:'hello' })

こういうdispatchに渡すオブジェクトを、

関数を含まない、

シンプルなテキストや状態のみを持つだけのもの

JSONにできそうなもの

にしてやりとりすれば、依存をなくせる

でも、依存がないというのはjsのモジュールとして依存が無いという意味であって

概念としては、わざわざ ADD_TODOというものを定義して、それを入れている

それは依存である

文字をうち間違えたら動かない

viewからstateの更新処理を切り離すためには

viewから発行するものをsimple objectにする以外にも、

すべきアクションを外部注入するというのもいいはず

アクションを外部から注入する

副作用が入る、とも考えられる

ならreact hooksがあるじゃないか

code:js

function Hoge() {

const {addTodo} = useAction();

const onClick = useCallback( e => addTodo(e.target.value) );

return (

<button onClick={onClick}>add</button>

)

}

どこかで定義したstate -> stateの関数のまとまりは、useActionから呼び出されるようにして

必要に応じて差し替えればいい

まあでも利用者からは、action creatorをimportして使うのと大差なさそうだな

hooks経由で、環境間の違いによる依存注入は大げさな気がしてきたが、

じゃあESModules単位での依存注入はできるんですかというと

しんどそう

でも画像とかを無理やりimportするwebpackとloaderってのはめちゃくちゃ大げさだと思う

それにくれべれば健全に思う

viewだけを動かしたいという要望はもっともだが

viewはそもそもなんらかのアクションを起こすものである側面もある

副作用にも色々あるという認識が必要だろうか

jsのimportと

useHoge

コードとしての依存

概念の依存

実行時

さしかえやすさは大事

まずはバリバリ書いたあと、

state->stateをさっとかく

あとからそれを外部に出していく

良い状態に近づけやすい

選択肢があるというのはいいこと

state->stateでもactionオブジェクトでもいいってのは

個人的にはそう思うが、リファクタリング能力がない人がプロジェクトにいるときにしんどいという声もありそう

actionobject渡すやつは、

動かないモックは作れるが、

動くやつをさっと作るときに、ぜったいreducerへ書かなきゃいけなくなる